﻿<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Dreamer CMS - 后台管理系统</title> 
    <link href="/resource/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="/resource/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
    <link href="/resource/css/ionicons.min.css" rel="stylesheet" type="text/css" />
    <link href="/resource/css/iCheck/all.css" rel="stylesheet" type="text/css" />
    <link href="/resource/css/style.css" rel="stylesheet" type="text/css" />
    <link href="/resource/js/editor.md-master/css/editormd.css" rel="stylesheet" type="text/css"/>
    <link href="/resource/js/tagit/jquery.tagit.css" rel="stylesheet" type="text/css"/>
    <link href="/resource/js/tagit/tagit.ui-zendesk.css" rel="stylesheet" type="text/css"/>
</head>

<body>
<div class="row">
    <div class="col-md-12">
    	<h1 class="panel-heading">编辑模板</h1>
        <!--breadcrumbs start -->
        <ul class="breadcrumb">
			<li><a href="/admin/dashboard/toIndex"><i class="fa fa-home"></i> 首页</a></li>
			<li class="active">编辑模板</li>
		</ul>
        <!--breadcrumbs end -->
    </div>
</div>
<section class="panel">
	<header class="panel-heading" style="text-transform:none;">
		<p style="margin:0;">模板目录：<b th:text="${path}"></b>&nbsp;&nbsp;模板文件：<b th:text="${file}"></b></p>
	</header>
	<div class="panel-body">
		<form class="col s12" id="form1" th:action="@{/admin/templates/save}" method="post" onsubmit="validateForm();">
			<input type="hidden" name="path" th:value="${path}" />
			<input type="hidden" name="file" th:value="${file}" />
			<input type="hidden" id="content" name="content" th:value="${content}" />
			<!--代码输入框（注意请务必设置高度，否则无法显示）-->
            <pre id="codeEditor" class="ace_editor" style="min-height:600px">
            	<textarea name="content" class="ace_text-input"></textarea>
            </pre>
            <div class="form-btn-group-left" shiro:hasAnyPermissions="system:template:toedit,system:template:save">
            	<button type="submit" class="btn btn-info">保存</button>
            </div>
		</form>
	</div>
</section>
<script src="/resource/js/jquery.min.js"></script>
<script src="/resource/js/aceeditor/ace.js" charset="utf-8"></script>
<script src="/resource/js/aceeditor/ext-language_tools.js" charset="utf-8"></script>
<script th:inline="javascript">
	var editor = null;
	var content = [[${content}]];
	
    $(document).ready(function () {
    	//初始化对象
    	editor = ace.edit("codeEditor");
    	//设置风格和语言（更多风格和语言，请到github上相应目录查看）
    	theme = "monokai";
    	language = "html";
    	editor.setTheme("ace/theme/" + theme);
    	editor.setValue(content);
    	editor.session.setMode("ace/mode/" + language);
    	//字体大小
    	editor.setFontSize(16);
    	//设置只读（true时只读，用于展示代码）
    	editor.setReadOnly(false);
    	//自动换行,设置为off关闭
    	editor.setOption("wrap", "free");
    	//启用提示菜单
    	//ace.require("ace/ext/language_tools");
    	editor.setOptions({
    		//enableBasicAutocompletion: true,
    		//enableSnippets: true,
    		//enableLiveAutocompletion: true
    	});
    });
    
    function validateForm(){
    	var newContent = editor.getValue();
    	$("#content").val(newContent);
    	return true;
    }
</script>
</body>
</html>
